<template>
	<div>
		<h4 style="text-align: justify;">我的成绩表</h4>
		<hr style="width: 100%;">
		<div>
			<table style="width: 95%;" border="1" cellspacing="0">
				<tbody>
					<tr>
						<th>学生编号</th>
						<th>学生名称</th>
						<th>班级编号</th>
						<th>班级名称</th>
						<th>课程编号</th>
						<th>课程名称</th>
						<th>课程成绩</th>
						<th>录入时间</th>
					</tr>
					<tr v-for="c in data.mymarks">
						<td>{{c.user.uid}}</td>
						<td>{{c.user.uname}}</td>
						<td>{{c.user.clz.clzno}}</td>
						<td>{{c.user.clz.clzname}}</td>
						<td>{{c.course.cno}}</td>
						<td>{{c.course.cname}}</td>
						<td>{{c.score}}</td>
						<td>{{day(c.tpost)}}</td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
</template>

<script setup>
	import { onMounted, reactive } from "vue";
	import { $get } from "@/ajax"
	
	const data = reactive({
		mymarks:[]
	})
	
	const day = (day) => {
		let d = new Date(day)
		let year = d.getFullYear()
		let moun = d.getMonth() + 1
		let date = d.getDate()
		return `${year}年${moun}月${date}日`;
	}
	
	onMounted(() => {
		$get('/api/fore/stu/findMyMark')
		.then( (resp) => {
			data.mymarks = resp.data.data
		})
	})
</script>

<style>
	td{
		font-size: 0.8em;
	}
</style>